<%--@elvariable id="pages" type="com.red.servlet.user.UserQueryServlet"--%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
   <meta http-equiv="content-type" content="text/html; charset=UTF-8">
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>用户管理</title>
   <%
      pageContext.setAttribute("APP_PATH", request.getContextPath());
   %>
   <link href="${APP_PATH}/static/bootstrap-3.4.1-dist/css/bootstrap.min.css" rel="stylesheet">
   <link href="${APP_PATH}/static/css/dashboard.css" rel="stylesheet">
   <link href="${APP_PATH}/static/css/common_style.css" rel="stylesheet">
</head>
<body>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
   <h1 class="page-header">用户管理</h1>
   <form id="user_manage_form" method="post" action="user_manage"><%-- 查询表单 --%>

      <div class="row">
         <div class="form-group">
            <div id="delete_group" class="hidden">
               <div class="col-lg-1">
                  <button type="button" class="btn btn-primary btn-block">确定</button>
               </div>
               <div class="col-lg-1">
                  <button type="button" class="btn btn-info btn-block">取消</button>
               </div>
               <div class="col-lg-1"></div>
            </div>
            <div id="modify_group" class="hidden">
               <div class="col-lg-1">
                  <button type="button" class="btn btn-info btn-block">返回</button>
               </div>
               <div class="col-lg-2"></div>
            </div>
            <div id="options_btn_group" class="">
               <div class="col-lg-1">
                  <button type="button" class="btn btn-primary btn-block" data-target="#user_add_modal"
                          data-toggle="modal">
                     添加
                  </button>
               </div>
               <div class="col-lg-1">
                  <button type="button" id="option_delete_btn"
                          class="btn btn-primary btn-block">删除
                  </button>
               </div>
               <div class="col-lg-1">
                  <button type="button" class="btn btn-primary btn-block">修改</button>
               </div>
            </div>
            <div class="col-md-1"><label><input type="checkbox" name="user_normal"
                                                <c:if test="${!(empty user_normal)}">checked</c:if> >普通租客</label>
            </div>
            <div class="col-md-1"><label><input type="checkbox" name="user_member"
                                                <c:if test="${!(empty user_member)}">checked</c:if>>会员</label>
            </div>
            <div class="col-md-1"><label><input type="checkbox" name="user_vip"
                                                <c:if test="${!(empty user_vip)}">checked</c:if>>贵宾</label></div>
            <div class="col-md-1"><label><input type="checkbox" name="user_admin"
                                                <c:if test="${!(empty user_admin)}">checked</c:if>>管理员</label>
            </div>
            <div class="col-md-1 col-md-offset-2">
               <select class="form-control" name="len">
                  <c:forEach var="i" begin="10" end="50" step="10">
                     <c:if test="${i == len}">
                        <option selected value="${i}">${i}</option>
                     </c:if>
                     <c:if test="${!(i==len)}">
                        <option value="${i}">${i}</option>
                     </c:if>
                  </c:forEach>
               </select>
            </div>
            <div class="col-lg-2">
               <button class="btn btn-primary btn-block" type="submit">查询</button>
            </div>
         </div>
      </div>
   </form>
   <hr/>
   <%-- 查询表单结束 --%>
   <form id="userlist_form" action="deleteUser" method="post">
      <input id="target" type="hidden" name="target" value=""/>
      <div class="table-responsive">
         <table id="table_user_list" class="table table-striped table-hover table-bordered">
            <thead>
            <tr>
               <th>ID</th>
               <th>用户名</th>
               <th>用户等级</th>
               <th>账号</th>
               <th>密码</th>
               <th>邮箱</th>
            </tr>
            </thead>
            <tbody>
            <%--@elvariable id="userList" type="com.red.entity.User"--%>
            <c:forEach items="${userList}" var="user">
               <tr>
                  <td><c:out value="${user.uID}"/></td>
                  <td><c:out value="${user.uName}"/></td>
                  <td class="text-center">
                     <c:choose>
                        <c:when test="${user.uLevel == 0}">
                           <span class="label label-primary">普通租客</span>
                        </c:when>
                        <c:when test="${user.uLevel == 1}">
                           <span class="label label-success">会员</span>
                        </c:when>
                        <c:when test="${user.uLevel == 2}">
                           <span class="label label-info">贵宾</span>
                        </c:when>
                        <c:when test="${user.uLevel == 3}">
                           <span class="label label-default">管理员</span>
                        </c:when>
                        <c:otherwise>
                           <span class="label label-default">意料之外的用户类型</span>
                        </c:otherwise>
                     </c:choose>
                  </td>
                  <td><c:out value="${user.uAccount}"/></td>
                  <td><c:out value="${user.uPassword}"/></td>
                  <td><c:out value="${user.uEmail}"/></td>
               </tr>
            </c:forEach>
            </tbody>
         </table>
      </div>
      <div id="page_navigation" class="container-fluid placeholders">
         <span>共 ${pages} 页记录</span>
         <nav aria-label="Page navigation">
            <ul class="pagination">
               <li>
                  <%--@elvariable id="curPage" type="com.red.servlet.user.UserQueryServlet"--%>
                  <c:if test="${(curPage-1)>0}">
                     <a href="user_manage?page=${curPage-1}" aria-label="Previous" page="${curPage-1}"><span
                             aria-hidden="true">&laquo;</span></a>
                  </c:if>
                  <c:if test="${!(curPage-1>0)}">
                     <a href="user_manage?page=${pages}" aria-label="Previous" page="1"><span
                             aria-hidden="true">&laquo;</span></a>
                  </c:if>
               </li>
               <c:forEach var="i" begin="${(curPage - 2 ) % curPage}" end="${curPage -1 }">
                  <c:if test="${i>0}">
                     <li><a href="user_manage?page=${i}" page="${i}"><c:out value="${i}"/></a></li>
                  </c:if>
               </c:forEach>

               <li class="active"><a href="user_manage?page=${curPage}" page="${curPage}"><c:out
                       value="${curPage}"/></a></li>

               <c:forEach var="i" begin="${curPage + 1}" end="${curPage + 2}">
                  <c:if test="${i <= pages}">
                     <li><a href="user_manage?page=${i}" page="${i}"><c:out value="${i}"/></a></li>
                  </c:if>
               </c:forEach>
               <li>
                  <c:if test="${(curPage+1) <= pages}">
                     <a href="user_manage?page=${curPage+1}" aria-label="Next" page="${curPage + 1}"><span
                             aria-hidden="true">&raquo;</span></a>
                  </c:if>
                  <c:if test="${!((curPage+1) <= pages)}">
                     <a href="user_manage?page=1" aria-label="Next" page="1"><span
                             aria-hidden="true">&raquo;</span></a>
                  </c:if>
               </li>
            </ul>
         </nav>
      </div>
      <%-- 分页 --%>
   </form>
</div>
<div id="user_add_modal" class="modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
   <div class="modal-dialog modal-lg" role="form">
      <div class="modal-content">
         <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                    aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">添加用户</h4>
         </div>
         <div class="modal-body">
            <div class="container-fluid">
               <form action="adduser" method="post">
                  <input type="hidden" name="uID" value="">
                  <div class="row">
                     <div class="col-xs-4">
                        <input name="uName" type="text" class="form-control" placeholder="用户名">
                     </div>
                     <div class="col-xs-4">
                        <input name="uAccount" type="text" class="form-control" placeholder="账号">
                     </div>
                     <div class="col-xs-4">
                        <input name="uPassword" type="text" class="form-control" placeholder="密码">
                     </div>
                  </div>
                  <hr/>
                  <div class="row">
                     <div class="col-xs-4">
                        <input name="uEmail" type="email" class="form-control" placeholder="邮箱">
                     </div>
                     <div class="col-xs-4">
                        <select name="uLevel" class="form-control">
                           <option value="0">普通租客</option>
                           <option value="1">会员</option>
                           <option value="2">贵宾</option>
                           <option value="3">管理员</option>
                        </select>
                     </div>
                     <div class="col-xs-2">
                        <button type="button" class="btn btn-danger btn-block" data-dismiss="modal">取消</button>
                     </div>
                     <div class="col-xs-2">
                        <button type="submit" class="btn btn-info btn-block">保存</button>
                     </div>
                  </div>
               </form>
            </div>
         </div>
      </div><!-- /.modal-content -->
   </div><!-- /.modal-dialog -->
</div>

<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ"
        crossorigin="anonymous"></script>
<script src="${APP_PATH}/static/bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/static/js/user_query_form.js"></script>
<script>
    <%--@elvariable id="addResult" type="com.red.servlet.user.UserAddServlet"--%>
    <c:if test="${!(empty addResult)}">
    alert("${addResult}")
    </c:if>
    <%--@elvariable id="deleteResult" type="com.red.servlet.user.UserDeleteServlet"--%>
    <c:if test="${!(empty deleteResult)}">
    alert("${deleteResult}")
    </c:if>
    <%--@elvariable id="updateResult" type="com.red.servlet.user.UserUpdateServlet"--%>
    <c:if test="${!(empty updateResult)}">
    alert("${updateResult}")
    </c:if>
</script>
</body>
</html>
